<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>

        function $(id) {
            return document.getElementById(id);
        }

        function checkName() {
            return checkFormElement(/^[a-zA-Z]{2,20}$/, 'nameInput', 'nameSpan');
        }

        function checkPwd() {
            return checkFormElement(/^[0-9]{6}$/, 'pwdInput', 'pwdSpan');
        }

        function checkEm() {
            return checkFormElement(/^[a-zA-Z0-9]{3,12}@[a-zA-Z0-9]{2,3}[.](com|cn|net)$/,
                'emInput', 'emSpan');
        }

        function checkPhone() {
            return checkFormElement(/^1[3578]\d{9}$/, 'phoneInput', 'phoneSpan');
        }

        function checkBirthday() {
            return checkFormElement(/^(19|20)\d{2}-(1[0-2]|0?[1-9])-(0?[1-9]|[1-2][0-9]|3[0-1])$/,
                'birthInput', 'birthSpan');
        }

        function checkFormElement(rexp, textId, spanId) {
            var spanObj = $(spanId);
            if (rexp.test($(textId).value)) {
                spanObj.innerHTML = "√"
                spanObj.style.color = "green"
                spanObj.style.fontSize = "15px"
                return true;
            } else {
                spanObj.innerHTML = "×"
                spanObj.style.color = "red"
                spanObj.style.fontSize = "15px"
                return false;
            }
        }

        function fromButton() {
            if (checkName() & checkPwd() & checkBirthday() & checkEm() & checkPhone()) {
                $("infoForm").submit();
            }
        }

    </script>
</head>
<body>
<form style="margin:50px 200px" id="infoForm">
    用户名：<input type="text" id="nameInput" onblur="checkName();">
    <span id="nameSpan"></span>
    <!--密码必须是6位数字。-->
    <br> 密 码：<input type="password" id="pwdInput" onblur="checkPwd();">
    <span id="pwdSpan"></span>
    <br> 邮 箱：<input type="text" id="emInput" onblur="checkEm();">
    <span id="emSpan"></span>
    <br> 电 话：<input type="text" id="phoneInput" onblur="checkPhone();">
    <span id="phoneSpan"></span>
    <br> 生 日：<input type="text" id="birthInput" onblur="checkBirthday();">
    <span id="birthSpan"></span>
    <br> <input style="margin:50px 50px 0px 150px" type="button" value="提交" id="buttonInput" onclick="fromButton();">
</form>
</body>
</html>